<template>
	<view class="ikz-apply">
		<ikz-loading :css-data="loading_css"></ikz-loading>
		<!-- 	<image class="ikz-top-bg" :src="img.apply_receive_background" mode="widthFix"></image> -->
		<view class="ikz-top-bg">
			<view class="top-box">
				<image src="/static/index/left-icon.png" style="width: 62rpx;height: 62rpx;z-index: 5;" mode="" @click="toback"></image>
				<view class="shen-title">
					接单申请
				</view>
			</view>

			<view class="cen-box">
				<view class="left-box">
					<view class="shenqing">
						接单申请
					</view>
					<view class="fubt">
						我是副标题
					</view>
				</view>
				<image src="/static/address/dui.png" style="width: 154rpx;height: 154rpx;margin-right: 30rpx;" mode="">
				</image>
			</view>

		</view>

		<view class="ikz-apply-form-box">

			<view class="ikz-apply-form">
				<!-- 24.06.13 隐藏公众号图片  -->
				<!-- <view class="ikz-apply-public">
					<image class="ikz-apply-public-img" @click="showImg(img.public_img,img.url)" mode="aspectFit"
						:src="img.public_img"> 
					</image>  
					<official-account></official-account>
				</view> -->
				<view class="ikz-apply-item">
					<image src="/static/index/index_xm.png" style="width: 54rpx;height: 54rpx;" mode=""></image>
					<view class="ikz-apply-title">
						姓名
					</view>
					<input class="ikz-apply-input" v-model="form_data.name" placeholder="请输入" />
				</view>
				<view class="ikz-apply-item">
					<image src="/static/index/index_xh.png" style="width: 54rpx;height: 54rpx;" mode=""></image>
					<view class="ikz-apply-title">
						学号
					</view>
					<input class="ikz-apply-input" v-model="form_data.student_no" placeholder="请输入" />
				</view>
				<view class="ikz-apply-item">
					<image src="/static/index/index_bj.png" style="width: 54rpx;height: 54rpx;" mode=""></image>
					<view class="ikz-apply-title">
						专业班级
					</view>
					<input class="ikz-apply-input" v-model="form_data.class" placeholder="请输入" />
				</view>
				<view class="ikz-apply-item">
					<image src="/static/index/index_sj.png" style="width: 54rpx;height: 54rpx;" mode=""></image>
					<view class="ikz-apply-title">
						手机号
					</view>
					<input class="ikz-apply-input" v-model="form_data.mobile" placeholder="请输入" />
				</view>
				<view class="ikz-apply-item">
					<image src="/static/index/index_sj.png" style="width: 54rpx;height: 54rpx;" mode=""></image>
					<view class="ikz-apply-title">
						微信号
					</view>
					<input class="ikz-apply-input" v-model="form_data.wechat" placeholder="请输入" />
				</view>
			</view>

			<view class="ikz-apply-form1">
				<view class="ikz-apply-updata-item1">
					<view class="ikz-updata-box">
						<image v-if="positiveImage && !files[0]" class="ikz-updata-add1" @click="addPic(2)" mode=""
							:src="positiveImage"></image>
						<image v-else-if="files[0]" class="ikz-updata-add1" @click="addPic(2)" mode="" :src="form_data.student_positive_image">
						</image>
						<image v-else class="ikz-updata-add" @click="addPic(2)" mode=""
							src="/static/receiver/updata1.png">
						</image>
						<view class="sc-txt" v-if="!positiveImage && !form_data.student_positive_image">
							上传学生证件
						</view>
					</view>
				</view>
			</view>
			
			<view class="tips">
				<view class="tips-txt">
					*加急审核请联系校区客服
				</view>
				<view class="btn-txt" @click="fuzhi">
					复制微信
				</view>
			</view>
			
			<view class="btn-box">
				<view class="ikz-updata-btn" @click="toMessage">
					提交申请
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import ikzLoading from '@/pages/Component/Public/Loading/loading.vue';
	var app = getApp( );
	import ikz from '@/pages/Common/tools.js';
	export default {
		components: {
			ikzLoading
		},
		data( ) {
			return {
				form_data: {
					name: '',
					student_no: '',
					student_positive_image: '',
					class:'',
					mobile:'',
					wechat:''
				},
				files: [ ],
				loading_css: {
					display: 'flex',
				},
				img: {},
				pageShow: false,
				template_id: {},
				adminImgPath: app.globalData.adminImgPath,
				positiveImage: '',
			}
		},
		onLoad( ) {
			this.templateId( )
			this.templatDetails( )
			this.imgInfo( ( res ) => {
				this.loading_css.display = 'none';
			} )
		},
		methods: {
			toback(){
				console.log('111');
				uni.navigateBack({
					data:1
				})
			},
			//获取申请详情
			templatDetails( ) {
				var path = '/xyb/user_receive_apply/details';
				var data = {
					token: uni.getStorageSync( 'local_user_session' ),
					agent_id: uni.getStorageSync( 'default_agent' ).id || ''
				}
				ikz.post( path, data, ( res ) => {
					if ( res.data.code ) {
						if ( res.data.data != null ) {
							this.form_data = res.data.data
							this.positiveImage = res.data.data.student_positive_image
							this.form_data.student_positive_image = res.data.data.student_positive_image
						}
					} else {
						uni.showModal( {
							title: '提示',
							content: res.data.msg,
							showCancel: false,
							success: function( res ) {}
						} );
					}
				} )
			},
			//获取模板参数
			templateId( ) {
				var path = '/xyb/wechat_mini_push/template_id_list';
				var data = {

				}
				ikz.post( path, data, ( res ) => {
					if ( res.data.code ) {
						this.template_id = res.data.data;
					} else {
						uni.showModal( {
							title: '提示',
							content: res.data.msg,
							showCancel: false,
							success: function( res ) {}
						} );
					}
				} )
			},
			agreementDetail( ) {
				uni.navigateTo( {
					url: '../../agreement/index'
				} )
			},
			imgInfo( fn ) {
				var path = '/xyb/same/receive_apply_img';
				var data = this.form_data;
				ikz.post( path, data, res => {
					if ( res.data.code ) {
						this.img = res.data.data
						this.payMethod = this.img.withdrawal_pay_method
						if ( res.data.data.apply_receive_image_show == 1 ) {
							this.pageShow = true
						} else {
							this.pageShow = false
						}
					} else {
						uni.showModal( {
							title: '提示',
							content: res.data.msg,
							showCancel: false,
							success: function( res ) {}
						} );
					}
					fn( );
				} );
			},
			//选择图片
			addPic( status ) {

				var that = this;
				wx.chooseImage( {
					count: 1,
					sizeType: [ 'original', 'compressed' ],
					sourceType: [ 'album', 'camera' ],
					success( res ) {
						// tempFilePath可以作为img标签的src属性显示图片
						console.log(res,'eeeee');
						if ( status == 2 ) {
							that.form_data.student_positive_image= res.tempFilePaths[ 0 ];
						}
						that.$forceUpdate( );
						that.$emit( 'returnFiles', that.files )
					}
				} )
			},
			fuzhi(){
				console.log('123');
				uni.setClipboardData({
				    data: this.form_data.wechat, // e是你要保存的内容
				    success: function () {
						
						uni.showToast({
							title:'复制成功',
							icon:'none'
						})
				    }
				})
			},
			// 订阅消息 
			toMessage( ) {
				var temp_id = [
					this.template_id.audit_result_notification,
				]
				//订阅消息 
				var that = this;
				uni.requestSubscribeMessage( {
					tmplIds: temp_id,
					success( res ) {
						that.submitUp( );
					},
					fail( res ) {
						that.up_status == 2;
						if ( res.errCode == 20004 ) {
							uni.showModal( {
								title: '提示',
								content: '请前往设置打开接受通知',
								confirmText: '确定',
								success( res ) {
									that.submitUp( );
								}
							} )

						} else {
							uni.showModal( {
								title: '提示',
								content: '未订阅消息，无法接收到订单通知',
								confirmText: '确定',
								success( res ) {
									that.submitUp( );
								}
							} )

						}

					}
				} )
			},
			//请求页面数据 
			submitUp( ) {
				// if(!this.pageShow) {
				// 	uni.showModal({
				// 		title: "提示",
				// 		showCancel: false,
				// 		content: "系统正在升级中，请稍后再试"
				// 	})
				// 	return
				// } 
				if ( this.form_data.name == '' ) {
					wx.showToast( {
						title: '请输入姓名',
						icon: 'error',
						duration: 2000
					} )
					return
				}
				if ( this.form_data.student_no == '' ) {
					wx.showToast( {
						title: '请输入学生证号',
						icon: 'error',
						duration: 2000
					} )
					return
				}
				if ( !this.positiveImage && this.pageShow && !this.files[ 0 ] ) {
					wx.showToast( {
						title: '学生证正面未选',
						icon: 'error',
						duration: 2000
					} )
					return
				}
				uni.showLoading( {
					name: '加载中',
					mask: true
				} )
				if ( this.pageShow && this.files[ 0 ] ) {
					this.upImg( 0 );
				} else if ( !this.pageShow && this.files[ 1 ] && this.files[ 2 ] ) {
					// 解决不需要学生证申请出错问题
					this.upImg( 1 );
				} else {
					this.upData( )
				}
			},
			//上传图片
			upImg( index ) {
				console.log( "this.files的值", this.files );
				var that = this;
				var path = "/common/upload";
				var data = {}
				ikz.up( path, data, 'file', this.files[ index ], ( res ) => {
					var temp_result_data = JSON.parse( res.data );
					if ( temp_result_data.code ) {
						if ( index == 0 ) {
							that.form_data.student_positive_image = temp_result_data.data.url;
						} 
						if ( that.files.length == ( index + 1 ) ) {
							that.upData( );
						} else {
							index++
							that.upImg( index )
						}
					} else {
						uni.showModal( {
							title: '提示',
							content: temp_result_data.msg,
							showCancel: false,
							success: function( res ) {}
						} );
						uni.hideLoading( );
					}
				} )
			},
			upData( ) {
				var path = '/xyb/User_Receive_Apply/submit_receive';
				var data = this.form_data;
				ikz.post( path, data, res => {
					if ( res.data.code ) {
						app.globalData.user_openinfo.run_apply_status = 0;
						uni.showToast( {
							title: '申请成功',
							mask: true,
							duration: 2000
						} );
						setTimeout( function( ) {
							uni.redirectTo( {
								url: '../success/index'
							} );
						}, 2000 )
					} else {
						uni.showModal( {
							title: '提示',
							content: res.data.msg,
							showCancel: false,
							success: function( res ) {}
						} );
					}
					uni.hideLoading( );
					// if(that.pull_status){
					// 	this.$emit("change",'pull');
					// }
				} );
			},
			showImg( url, path ) {
				var path_temp = path || {}
				if ( path_temp.path ) {
					ikz.getNav( path );
				} else {
					var arr = [ ];
					arr.push( url )
					uni.previewImage( {
						urls: arr,
						longPressActions: {
							itemList: [ '发送给朋友', '保存图片', '收藏' ],
							success: function( data ) {
								console.log( '选中了第' + ( data.tapIndex + 1 ) + '个按钮,第' + ( data.index + 1 ) +
									'张图片' );
							},
							fail: function( err ) {
								console.log( err.errMsg );
							}
						}
					} );

				}

			},

			//跳转至招聘中心
			getRecriut( ) {
				let url = '/pages/Component/Module/Demand/Program/Recruit/index';
				ikz.nav( url, 'n' );
			},

		}
	};
</script>

<style>
	page {
		width: 100%;
		height: 100%;
		background: #F3F3F3;
		position: relative;
	}

	.ikz-top-bg {
		width: 100%;
		z-index: -1;
		height: 400rpx;
		background: linear-gradient(180deg, #B8D5FF 0%, #FFFFFF 100%);
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		padding-top: 102rpx;
		padding-left: 30rpx;
		box-sizing: border-box;
	}

	.top-box {
		width: 100%;
		height: 48rpx;
		display: flex;
		justify-content: space-between;
	}

	.cen-box {
		width: 100%;
		height: 154rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;


	}

	.left-box {
		width: 60%;
		height: 154rpx;
		padding-top: 42rpx;
		box-sizing: border-box;
	}

	.shenqing {
		width: 128rpx;
		height: 48rpx;
		font-weight: 500;
		font-size: 32rpx;
		color: #000000;
		text-align: left;
	}

	.fubt {
		width: 120rpx;
		height: 36rpx;
		font-weight: 400;
		font-size: 24rpx;
		color: #000000;
		text-align: left;
		margin-top: 12rpx;
	}

	.shen-title {
		width: 438rpx;
		height: 48rpx;
		font-weight: 500;
		font-size: 32rpx;
		color: #000000;
		text-align: left;
	}

	.title_txt {
		width: 96rpx;
		height: 48rpx;
		font-weight: 500;
		font-size: 32rpx;
		color: #067CFF;
		text-align: center;
		/* margin: 110rpx auto 0px; */
		// z-index: 2;
	}


	.ikz-apply-form-box {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 100%;
		/* display: flex;
		align-items: center; */
	}

	.ikz-apply-form {
		box-sizing: border-box;
		padding: 30rpx 15rpx;
		width: 95%;
		margin: 46% auto 10rpx;
		background: #fff;
		border-radius: 15rpx;
		z-index: 99;
	}

	.ikz-apply-form1 {
		width: 95%;
		height: 240rpx;
		margin: 20rpx auto;
		background: #fff;
		border-radius: 15rpx;
		z-index: 99;
		display: flex;
		flex-direction: column;
	}
	
	.tips{
		width: 690rpx;
		height: 114rpx;
		background: #FFFFFF;
		border-radius: 24rpx 24rpx 24rpx 24rpx;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 24rpx;
		box-sizing: border-box;
	}
	
	.tips-txt{
		height: 48rpx;
		font-weight: 400;
		font-size: 32rpx;
		color: #247EFF;
		text-align: left;
	}
	
	.btn-txt{
		width: 164rpx;
		height: 66rpx;
		background: #F5F7FB;
		border-radius: 46rpx 46rpx 46rpx 46rpx;
		border: 1rpx solid #247EFF;
		font-weight: 400;
		font-size: 28rpx;
		color: #247EFF;
		text-align: center;
		line-height: 66rpx;
	}
	
	.btn-box{
		width: 100%;
		height: 176rpx;
		background: #FFFFFF;
		border-radius: 24rpx 24rpx 0rpx 0rpx;
		position: fixed;
		bottom: 0;
		left: 0;
	}

	.ikz-apply-item {
		display: flex;
		align-items: center;
		padding: 20rpx 15rpx;
	}

	.ikz-apply-title {
		width: 200rpx;
	}

	.ikz-apply-input {
		width: 470rpx;
		height: 90rpx;
		background: #F5F7FB;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		border: 1rpx solid #CECECE;
		padding: 0 24rpx;
		box-sizing: border-box;
	}

	.ikz-updata-box {
		width: 100%;
		height: 100%;
		display: flex;
		align-items: center;
		flex-direction: column;
		justify-content: space-around;
	}

	.ikz-apply-updata-item {
		padding: 20rpx 15rpx;
		box-sizing: border-box;
	}

	.ikz-apply-updata-item1 {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
	}
	.ikz-updata-add1 {
		width: 100%;
		height: 100%;
	}

	.ikz-updata-add {
		width: 315rpx;
		height: 110rpx;
	}

	.sc-txt {
		font-weight: 400;
		font-size: 28rpx;
		color: #666666;
		text-align: center;
	}

	.ikz-updata-btn {
		position: relative;
		width: 690rpx;
		height: 88rpx;
		margin: 0 auto;
		background: #247EFF;
		color: #fff;
		text-align: center;
		border-radius: 50rpx;
		line-height: 88rpx;
		margin-top: 14rpx;
	}

	.ikz-apply-public {
		height: 270rpx;
	}

	.ikz-apply-public-img {
		width: 100%;
		height: 270rpx;
	}

	.ikz-apply-checkbox {
		display: flex;
		align-items: center;
		font-size: 25rpx;
	}

	checkbox {
		transform: scale(0.6, 0.6);
	}

	.ikz-apply-checkbox {
		margin-bottom: 15rpx;
	}
</style>